import arrivalRecordOrder from '@/components/afterSales/arrivalRecordOrder.vue'
import technicianSelector from '@/components/afterSales/technicianSelector.vue'

export default {
  data() {
    return {
      id: '', //订单id
      info: {}, //订单信息
      status: 0, //0 排队中 1 施工中 2 已取车 3 未消费、离店
      isStop: true, //是否暂停施工
      showTop: false, //顶部更多弹窗
      showBottom: false, //底部更多弹窗
      showModal: false, //弹窗
      modalText: '',
      modalBtnLeft: '取消',
      modalBtnRight: '确定取消',
      modalTitle: '取消到店',
      eventType: '',
      showSelector: false, //选择技师弹窗
      technicianCurrent: -1, //技师选项
      orderId: '', //操作的关联订单
      orderStatus: 0, //操作的关联订单状态
      bottomList: [
        { value: 6, name: '完工未取车' },
        { value: 7, name: '完工已取车' },
        { value: 3, name: '取消到店' },
      ],
      isOnlyWash: false, //仅洗车
      visualCheckProgress: 0, //预检进度
      qualityProgress: 0, //质检状态
      workExcptionProgress: 0, //施工异常状态
      popupShow: false, //编辑联系人弹窗
      editName: '', //编辑的姓名
      yjText: '车辆到店立即填写', //预检状态文字
      yjColor: 'color-999',
      sjText: '施工前填写', //上检状态文字
      sjColor: 'color-999',
      sgText: '施工过过程中填写', //施工异常状态文字
      sgColor: 'color-999',
      zjText: '请完成上检质检', //质检状态文字
      zjColor: 'color-999',
      pageLoading: false,
    }
  },

  computed: {
    topList() {
      return [
        { value: 0, name: '新建订单' },
        { value: 1, name: '扫码核销' },
        { value: 2, name: '派工' },
        { value: 3, name: '取消到店' },
        {
          value: this.orderStatus === 11 ? 5 : 4,
          name: this.orderStatus === 11 ? '恢复施工' : '暂停施工',
        },
        { value: 6, name: '完工未取车' },
        { value: 7, name: '完工已取车' },
      ]
    },

    statusIcon() {
      if (
        this.info.status === 10 ||
        this.info.status === 11 ||
        this.info.status === 20
      ) {
        return 'iconanzhuangshigong'
      }
      if (this.info.status === 20) {
        return 'iconxuanzhong'
      }
      if (this.info.status === 30) {
        return 'iconquxiaoxunjia'
      }
      return 'iconpaiduijiaohao'
    },
  },

  onNavigationBarButtonTap() {
    this.showTop = !this.showTop
    this.showBottom = false
  },

  onLoad(e) {
    this.id = e.id
  },

  onShow() {
    this.getInfo()
    // this.getProgress()
    this.getDetectionState()
  },

  methods: {
    //获取订单详情
    getInfo() {
      this.$api.afterSales
        .arrivalRecordDetail({
          arriveId: this.id,
        })
        .then((res) => {
          this.info = res.data
          this.pageLoading = true
          this.$store.commit('afterSales/setCar', {
            img: res.data.brandImg,
            name: res.data.carName,
            carbrand: res.data.carNum, // 车牌
            km: res.data.mileage, // 公里数
            vin: res.data.vin,
            tireSize: res.data.tireSize, //轮胎规格
            carId: res.data.carId, //车辆id
            loveCarId: res.data.loveCarId, //车辆id
            engineType: res.data.engineType, //发动机号
          })
          this.$store.commit('afterSales/setUserInfo2', {
            userId: res.data.userId,
            userImg: res.data.userImg,
          })
          this.$store.commit('afterSales/setUserInfo', {
            name: res.data.userName,
            mobile: res.data.userMobile,
          })
          // const arr = Object.keys(this.info.queueStrs)
          // if (
          //   arr.length === 1 &&
          //   (!res.data.orders || res.data.orders.length < 2)
          // ) {
          //   this.isOnlyWash = this.info.queueStrs.hasOwnProperty('洗车')
          // }
          if (!res.data.orders && this.info.orderService === '洗车') {
            this.isOnlyWash = true
          }
          if (
            res.data.orders &&
            this.info.orderService === '洗车' &&
            res.data.orders.length < 2
          ) {
            this.isOnlyWash = true
          }
          this.$store.commit('afterSales/setArrvialId', {
            id: this.info.arriveId,
            phone: this.info.userMobile,
            worker: this.info.wokers[0] ? this.info.wokers[0] : '--',
            workerTime: this.info.workAddTime ? this.info.workAddTime : '--',
            qualityState: this.info.testInfo.qualityInfo === null ? 2 : 1,
            orderService: this.info.orderService,
          })
          uni.setNavigationBarTitle({
            title: '到店记录(编号:' + this.info.notify + ')',
          })
          if (this.orderId) {
            this.info.orders.forEach((order) => {
              if (order.orderId === this.orderId) {
                this.orderStatus = order.status
              }
            })
          }
        })
        .catch((err) => {
          console.log(err)
          this.pageLoading = true
        })
    },

    //预检进度
    getProgress() {
      this.$api.afterSales
        .getProgress({
          order_Arrive_Store_Id: this.id,
          type: 0,
        })
        .then((res) => {
          this.visualCheckProgress = res.data.detection_Progress
        })
        .catch((e) => {
          console.log(e)
        })
    },

    //检查进度
    getDetectionState() {
      this.$api.afterSales
        .getDetectionState({
          Order_Arrive_Store_Id: this.id,
        })
        .then((res) => {
          //预检状态
          this.visualCheckProgress = res.data.ptiPageStatus
          if (res.data.ptiStatus === 1) {
            this.yjText = '预检未完成'
            this.yjColor = 'color-EB5C02'
          } else if (res.data.ptiStatus === 2) {
            this.yjText = '待客户签字确认'
            this.yjColor = 'color-EB5C02'
          } else if (res.data.ptiStatus === 3) {
            this.yjText = '已签字确认'
            this.yjColor = 'color-333'
          } else {
            this.yjText = '车辆到店立即填写'
            this.yjColor = 'color-999'
          }
          //上检状态
          if (res.data.inspectionStatus === 1) {
            this.sjText = '上检未完成'
            this.sjColor = 'color-EB5C02'
          } else if (res.data.inspectionStatus === 2) {
            this.sjText = '待客户签字确认'
            this.sjColor = 'color-EB5C02'
          } else if (res.data.inspectionStatus === 3) {
            this.sjText = '已签字确认'
            this.sjColor = 'color-333'
          } else {
            this.sjText = '施工前填写'
            this.sjColor = 'color-999'
          }
          //异常施工状态
          this.workExcptionProgress = res.data.workExcption
          if (res.data.workExcption === 1) {
            this.sgText = '施工未完成'
            this.sgColor = 'color-EB5C02'
          } else if (res.data.workExcption === 2) {
            this.sgText = '待客户签字确认'
            this.sgColor = 'color-EB5C02'
          } else if (res.data.workExcption === 3) {
            this.sgText = '已签字确认'
            this.sgColor = 'color-333'
          } else {
            this.sgText = '施工过程中填写'
            this.sgColor = 'color-999'
          }
          //质检状态
          this.qualityProgress = res.data.qualityInfo
          if (res.data.qualityInfo === 3) {
            this.zjText = '已完成质检'
            this.zjColor = 'color-333'
          } else if (
            res.data.ptiStatus === 3 &&
            res.data.inspectionStatus === 3
          ) {
            this.zjText = '待提交质检报告'
            this.zjColor = 'color-EB5C02'
          } else if (
            res.data.ptiStatus !== 0 ||
            res.data.inspectionStatus !== 0
          ) {
            this.zjText = '请完成上检/预检后质检'
            this.zjColor = 'color-999'
          } else {
            this.zjText = '请完成质检'
            this.zjColor = 'color-999'
          }
        })
        .catch((e) => {
          console.log(e)
        })
    },

    //隐藏弹窗
    hideTips() {
      this.showTop = false
      this.showBottom = false
    },

    //显示底部弹窗
    showBottomTips() {
      this.showBottom = !this.showBottom
      this.showTop = false
    },

    //选择技师
    selTechnician(e) {
      this.showSelector = false
      this.$api.afterSales
        .doDispatch({
          workId: e.accountId,
          orderId: this.orderId,
        })
        .then((res) => {
          uni.showToast({
            title: '您已成功选择' + e.name + '接车施工',
            icon: 'none',
            duration: 2000,
          })
          setTimeout(() => {
            this.getInfo()
            this.$refs.technicianSel.getlist()
          })
        })
        .catch((e) => {})
    },

    closeEchnician() {
      this.showSelector = false
    },

    //选择订单
    selOrder(order) {
      this.orderId = order.orderId
      this.orderStatus = order.orderStatus
      if (order.orderStatus === 0) {
        this.selTip(2)
      }
    },

    //弹窗点击操作
    handleTips(name) {
      if (!this.showTop && !this.showBottom) {
        return
      }
      this.hideTips()
      this.selTip(name)
    },

    //操作选择
    selTip(name) {
      if (name === 4 && this.orderStatus === 10) {
        if (!this.orderId) {
          uni.showToast({
            title: '请选择操作的关联订单/商品',
            icon: 'none',
          })
        } else {
          this.modalText = '是否确认操作暂停施工'
          this.modalBtnLeft = '取消'
          this.modalBtnRight = '确认'
          this.modalTitle = '暂停施工'
          this.showModal = true
        }
      } else if (name === 5 && this.orderStatus === 11) {
        if (!this.orderId) {
          uni.showToast({
            title: '请选择操作的关联订单/商品',
            icon: 'none',
          })
        } else {
          this.modalText = '是否确认操作恢复施工？'
          this.modalBtnLeft = '取消'
          this.modalBtnRight = '确认'
          this.modalTitle = '暂停施工'
          this.showModal = true
        }
      } else if (name === 0) {
        if (this.info.status === 20 || this.info.status === 30) {
          this.gotoPage('welcomeGuest/welcomeGuest')
        } else {
          this.gotoPage('newMaintenanceOrder/newMaintenanceOrder')
        }
      } else if (
        name === 1 &&
        this.info.status !== 20 &&
        this.info.status !== 30
      ) {
        this.scanPage()
      } else if (
        name === 2 &&
        this.info.status !== 20 &&
        this.info.status !== 30
      ) {
        //派工
        if (!this.orderId) {
          uni.showToast({
            title: '请选择操作的关联订单/商品',
            icon: 'none',
          })
        } else {
          // 车辆信息检查，车辆信息不全无法进行派工操作
          if (!this.info.carNum || !this.info.vin || !this.info.mileage) {
            uni.showToast({
              title: '请补全车辆信息',
              icon: 'none',
            })
            return
          }
          this.showSelector = true
        }
      } else if (
        name === 6 &&
        (this.info.status === 11 || this.info.status === 10)
      ) {
        this.modalText = '是否确认操作完工未取车？'
        this.modalBtnLeft = '取消'
        this.modalBtnRight = '确认'
        this.modalTitle = '完工未取车'
        this.showModal = true
      } else if (
        name === 7 &&
        (this.info.status === 11 ||
          this.info.status === 10 ||
          this.info.status === 12)
      ) {
        this.modalText = '是否确认操作完工已取车？'
        this.modalBtnLeft = '取消'
        this.modalBtnRight = '确认'
        this.modalTitle = '完工已取车'
        this.showModal = true
      } else if (name === 3 && this.info.status === 0) {
        this.modalText = '是否确认操作取消到店？'
        this.modalBtnLeft = '取消'
        this.modalBtnRight = '确认'
        this.modalTitle = '取消到店'
        this.showModal = true
      } else {
        uni.showToast({
          title: '当前订单无法执行该操作',
          duration: 2000,
          icon: 'none',
        })
      }
      this.eventType = name
    },

    //
    modalConfirme() {
      this.showModal = false
      if (this.eventType === 4) {
        //暂停施工
        this.handleOrder(11)
      } else if (this.eventType === 5) {
        //恢复施工
        this.handleOrder(10)
      } else if (this.eventType === 6) {
        //完工未取车
        this.handleOrder(12)
      } else if (this.eventType === 7) {
        //完工已取车
        this.handleOrder(20)
      } else if (this.eventType === 3) {
        //取消到店
        this.handleOrder(30)
      }
    },

    //
    modalCancel() {
      this.showModal = false
    },

    //操作到店单状态
    handleOrder(status) {
      this.$api.afterSales
        .changeOrderArriveStatus({
          arriveId: this.id,
          orderId: this.orderId,
          status,
        })
        .then((res) => {
          uni.showToast({
            title: res.data,
            duration: 2000,
          })
          this.orderStatus = status
          setTimeout(() => {
            this.getInfo()
            if (status === 10 || status === 11 || status === 12) {
              this.$refs.technicianSel.getlist()
            }
          })
        })
        .catch((e) => {})
    },

    //扫码核销
    scanPage() {
      // #ifdef APP-PLUS
      uni.scanCode({
        success: (res) => {
          const result = JSON.parse(res.result)
          if (result.state === 2) {
            this.$api.afterSales
              .addNewOrderToArrive({
                orderId: result.id,
              })
              .then(() => {
                uni.showToast({
                  title: '核销成功',
                  duration: 2000,
                })
                this.getInfo()
              })
              .catch((err) => {
                console.log(err)
              })
          } else if (result.state == 8) {
            this.$api.afterSales
              .getCarNumberByCoupon({ id: result.id })
              .then((datas) => {
                if (result.Is_Package) {
                  if (
                    !datas.data.isNeedAddCar &&
                    datas.data.car_num &&
                    datas.data.car_num !== this.info.carNum
                  ) {
                    uni.showToast({
                      title: '福利包中绑定的车辆非当前到店车辆',
                      icon: 'none',
                      duration: 2000,
                    })
                  } else {
                    uni.navigateTo({
                      url:
                        '/pages_afterSales/selectSetMenu/selectSetMenu?type=1&packageId=' +
                        result.id +
                        '&id=' +
                        this.id,
                    })
                  }
                } else {
                  uni.navigateTo({
                    url:
                      '/pages_afterSales/createMaintenanceOrder/createMaintenanceOrder',
                  })
                }
              })
              .catch((err) => {
                console.log(err)
              })
          } else {
            uni.showToast({
              title: '请出示维保订单核销码/优惠券码',
              icon: 'none',
            })
            return
          }
        },
      })
      // #endif
    },

    //页面跳转
    gotoPage(url) {
      if (
        url === 'newMaintenanceOrder/newMaintenanceOrder' &&
        (this.info.status === 20 || this.info.status === 30)
      ) {
        uni.redirectTo({
          url: '/pages_afterSales/welcomeGuest/welcomeGuest',
        })
      } else {
        uni.navigateTo({
          url: '/pages_afterSales/' + url + '?id=' + this.info.arriveId,
        })
      }
    },

    //预检
    gotoVisual() {
      if (this.info.testInfo.ptiStatus < 2) {
        if (this.qualityProgress === 3) {
          uni.showToast({
            title: '已完成质检，无法进行预检操作',
            icon: 'none',
            duration: 2000,
          })
        } else if (this.visualCheckProgress === 3) {
          //内饰
          uni.navigateTo({
            url:
              '/pages_afterSales/visualCheck/visualCheckInside?back=1&id=' +
              this.id,
          })
        } else if (this.visualCheckProgress === 4) {
          //仪表盘
          uni.navigateTo({
            url:
              '/pages_afterSales/visualCheck/visualCheckMeter?back=1&id=' +
              this.id,
          })
        } else if (this.visualCheckProgress === 5) {
          //其他
          uni.navigateTo({
            url:
              '/pages_afterSales/visualCheck/visualCheckOthers?back=1&id=' +
              this.id,
          })
        } else if (this.visualCheckProgress === 1) {
          //技师签字
          this.$store.commit('afterSales/setSignData', {
            id: this.id,
            type: 0, //0预检,1上检测，2质检交车报告
            figure: 0, //0技师，1客户
          })
          const param = JSON.stringify({
            type: 'before',
            count: 2,
            fnName: 'arrvialOrderSign',
          })
          const data = JSON.stringify({
            type: 'after', // before为回退页面， after为下一页
            url:
              '/pages_afterSales/orderConfirm/customerConfirm?typeOptions=' +
              param, // 下一页的页面路径
            fnName: 'arrvialOrderSign', //接口
          })
          uni.navigateTo({
            url:
              '/pages_afterSales/signature/signature?back=1&title=技师签字&typeOptions=' +
              data,
          })
        } else {
          //未预检
          uni.navigateTo({
            url:
              '/pages_afterSales/visualCheck/visualCheckOutside?back=1&id=' +
              this.id,
          })
        }
      } else {
        uni.navigateTo({
          url: '/pages_afterSales/visualCheck/visualCheckReport?id=' + this.id,
        })
      }
    },

    //上检
    gotoDismantle() {
      if (this.info.testInfo.inspectionStatus < 2) {
        if (this.qualityProgress !== 3) {
          //技师未签字
          uni.navigateTo({
            url:
              '/pages_afterSales/dismantleCheck/dismantleCheck?id=' + this.id,
          })
        } else {
          uni.showToast({
            title: '已完成质检，无法进行上检操作',
            icon: 'none',
            duration: 2000,
          })
        }
      } else {
        uni.navigateTo({
          url:
            '/pages_afterSales/dismantleCheck/dismantleCheckReport?id=' +
            this.id,
        })
      }
    },

    //施工异常
    gotoworkExcption() {
      if (this.qualityProgress === 3 && this.workExcptionProgress !== 3) {
        uni.showToast({
          title: '已完成质检，无法进行施工异常操作',
          icon: 'none',
          duration: 2000,
        })
      } else {
        uni.navigateTo({
          url:
            '/pages_afterSales/constructionOrder/constructionOrder?id=' +
            this.info.arriveId,
        })
      }
    },

    call(phone) {
      uni.makePhoneCall({
        phoneNumber: phone,
      })
    },

    //修改客户姓名
    editUserName() {
      this.editName = this.info.userName
      this.popupShow = true
    },
    //保存用户姓名
    okey() {
      if (!this.editName) {
        uni.showToast({
          title: '请填写客户姓名',
          icon: 'none',
        })
        return
      }
      if (this.editName === this.info.userName) {
        uni.showToast({
          title: '客户姓名未修改',
          icon: 'none',
        })
        return
      }
      this.$api.afterSales
        .updateUserName({
          arriveId: this.id,
          userName: this.editName,
        })
        .then(() => {
          this.getInfo()
          uni.showToast({
            title: '修改成功',
            duration: 2000,
          })
          this.popupShow = false
        })
        .catch((err) => {
          console.log(err)
        })
    },
    //取消修改用户姓名
    cancel() {
      this.popupShow = false
    },
  },

  components: {
    arrivalRecordOrder,
    technicianSelector,
  },
}
